import React, {PureComponent} from 'react'
// import Pie from '../component/stock/pie'
import Pie from '../component/chart/base-pie'
// import Pie from '../component/scheduling/pies'
import '../../css/stock.scss'
import {getInventory} from '../action/map.action'
import {connect} from 'react-redux'
class Stock extends PureComponent {

    componentDidMount() {
        const {dispatch} = this.props
        dispatch(getInventory())
    }

    shouldComponentUpdate(nextProps) {
        return nextProps.inventory !== this.props.inventory
    }

    renderDate = (data) => {
        const inventory = data.toJS()
        return inventory.map(inven => {
            return {
                title: inven.factoryName,
                option: {},
                data: Object.keys(inven.types || {}).map(key => {
                    return {
                        name: key,
                        value: inven.types[key]
                    }
                })
            }
        })
    }

    getCurrentFactory = (factory, inventory) => {
        return inventory[inventory.findIndex(t => {
                return t.title === factory
            })] || {}
    }

    render() {
        const inventory = this.renderDate(this.props.inventory)
        return (
            <div>
                <div className="full-container">
                    <div className="stock-big-pie">
                        <Pie config={this.getCurrentFactory('H3C', inventory)}/>
                    </div>

                    <div className="stock-small-pie">
                        {
                            ['达创', '统合', '双赢', '飞旭'].map((factory, i) => {
                                return <div className="stock-small-box" key={`stock-pie-${i}`}>
                                    <Pie config={this.getCurrentFactory(factory, inventory)}/>
                                </div>
                            })
                        }
                    </div>
                </div>
            </div>
        )
    }

}

function mapStateToProps({inventory}) {
    return {
        inventory
    }
}

export default connect(mapStateToProps)(Stock)